<style scoped lang="scss">
    .xy-switch {
    }
</style>
<template>
    <switch :checked="checked" @change="switchChange" />
</template>
<script>
export default {
    name: 'XySwitch',
    props: {
        value: {
            type: [String, Number, Boolean],
            default: false
        },
        checked: {
            type: [Boolean],
            default: false
        },
        trueValue: {
            type: [String, Number, Boolean],
            default: true
        },
        falseValue: {
            type: [String, Number, Boolean],
            default: false
        },
        disabled: {
            type: Boolean,
            default: false
        },
    },
    data() {
        return {
        }
    },
    created: function () {
        if (this.value == this.trueValue) {
            this.checked = true;
        }
    },
    methods: {
        switchChange(evt){
            if (evt.target.value == 'checked') {
                this.$emit('input', this.trueValue);
            } else {
                this.$emit('input', this.falseValue);
            }
        }
    }
}
</script>
